<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="${pageContext.request.contextPath }/static/css/blog.css">
<title>Insert title here</title>
<script type="text/javascript">

	function showOtherComment(){
		$(".otherComment").show();
	} 
	function loadimage(){
		document.getElementById("randImage").src="${pageContext.request.contextPath}/image.jsp?"+Math.random();
	}
	function submitData(){
		var content=$("#content").val();
		var imageCode=$("#imageCode").val();
		if(content==null||content==""){
			alert("请输入评论内容");
		}else if(imageCode==null||imageCode==""){
			alert("请填写验证码!")
		}else{
			$.post("${pageContext.request.contextPath}/comment/save.do",{"content":content,"imageCode":imageCode,"blog.id":'${blog.id}'},function(result){
				
				if(result.success){
					alert("评论已提交成功，审核通过后显示！");
					window.location.reload();
					
					
				}else{
					
					alert(result.errorInfo);
				}
			},"json")
		}
	}
</script>
</head>
<body>

<div class="data_list">
	<div class="data_list_title">
		<img src="/static/images/blog_show_icon.png"/>
		博客信息
	</div>
	<div>
		<div class="blog_title"><h3><strong>${blog.title }</strong></h3></div>
		<div class="blog_share">
			<div class="bshare-custom"><a title="分享到QQ空间" class="bshare-qzone"></a><a title="分享到新浪微博" class="bshare-sinaminiblog"></a><a title="分享到人人网" class="bshare-renren"></a><a title="分享到腾讯微博" class="bshare-qqmb"></a><a title="分享到网易微博" class="bshare-neteasemb"></a><a title="更多平台" class="bshare-more bshare-more-icon more-style-addthis"></a><span class="BSHARE_COUNT bshare-share-count">0</span></div><script type="text/javascript" charset="utf-8" src="http://static.bshare.cn/b/buttonLite.js#style=-1&amp;uuid=&amp;pophcol=3&amp;lang=zh"></script><script type="text/javascript" charset="utf-8" src="http://static.bshare.cn/b/bshareC0.js"></script>
		</div>
		<div class="blog_info">
		发布时间：『<fmt:formatDate value="${blog.releaseDate }" type="date" pattern="YYYY-mm-dd HH:mm"/>』博客类型：${blog.blogType.typeName }&nbsp;&nbsp;
		阅读(${blog.clickHit })&nbsp;&nbsp;评论(${blog.replyHit })		
													   
		</div>
		<div class="blog_content">${blog.content }</div>
	
		<div class="blog_keyword">关键字：
			<c:choose>
				<c:when test="${keyWords==null}">
					&nbsp;&sbsp;无
				</c:when>
				<c:otherwise>
					<c:forEach var="keyWord" items="${keyWords}">
					&nbsp;&nbsp;<a href="${pageContext.request.contextPath}/blog/search.html?keyword=${keyWord}" target="_blank">${keyWord} &nbsp;&nbsp;</a>
					</c:forEach>
				</c:otherwise>
			</c:choose>
			
		</div>		
		<div class="blog_lastAndNextPage">
			${pageCode }
		</div>
	</div>
	
</div>
<div class="data_list" >
	<div>评论信息：
		<c:if test="${commentList.size()>10 }">
			<a href="javascript:showOtherComment()">显示所有评论</a>
		</c:if>
	</div>

	<div class="commentDatas">
		<c:choose>
			<c:when test="${commentList.size()==0 }">
				暂无评论
			</c:when>
			<c:otherwise>
				<c:forEach var="comment" items="${commentList}" varStatus="status">
					<c:choose>
						<c:when test="${status.index<10 }">
							<div class="comment">${status.index+1 }楼&nbsp;${comment.userIp }&nbsp;&nbsp;${comment.content }&nbsp;&nbsp;
							[ <fmt:formatDate value="${comment.commentDate }" type="Date" pattern="yyyy-MM-dd HH:mm "/> ]</div>
						
						</c:when>
						<c:otherwise>
						
							<div class="otherComment">${status.index+1 }楼&nbsp;${comment.userIp }&nbsp;&nbsp;${comment.content }&nbsp;&nbsp;
							[ <fmt:formatDate value="${comment.commentDate }" type="Date" pattern="yyyy-MM-dd HH:mm "/> ]</div>
						
						</c:otherwise>
				
					</c:choose>
				
				</c:forEach>
			</c:otherwise>
		</c:choose>
	
	</div>

</div>
<div class="data_list">
	<div class="data_list_title">
		<img src="/static/images/publish_comment_icon.png"/>
		发表评论
	</div>
	<div class="publish_comment">
		<div>
			<textarea style="width:100%" rows="3" id="content" name="content" placeholder="来说两句吧。。。"></textarea>
		</div>
		<div class="verCode">
			验证码：<input type="text" value="" name="imageCode" id="imageCode" size="10" />
			<img  onlcick="javascript:loadimage();" title="换一张试试" src="/image.jsp" width="60" height="20" border="1">
					
		</div>
		<div class="publishButton">
			<button class="btn btn-primary" type="button" onclick="submitData()">发表评论</button>
		</div>
	</div>
</div>

</body>
</html>